<template>
  <view class="detail-item">
    <view class="item-title" :class="isBold ? 'bold' : 'weight'">通用说明</view>
    <view class="item-intro intro_txt" :class="isDown ? 'heightMy' : ''">
      <!--      <image v-if="title == '产品说明'" :src="img_src" style="width: 100%" mode="widthFix"></image>-->
      <view class="title"> <div class="leftpoint">·</div> 爱人者，人恒爱之，敬人者，人恒敬之。请使用“您好”、“请”、“麻烦”等礼貌用语，<text class="titles">请每一句话最后都加上“谢谢”，</text>减少不必要的工作摩擦。委托人一旦对您的工作态度有意见了，后面解释啥都没用，没必要人为增加自己的工作难度，影响身心健康。</view>
      <view class="title"> <div class="leftpoint">·</div> 请在接单后1分钟内与委托人先联系一下，避免委托人因等待太长而产生情绪，影响服务感受。</view>
      <view class="title u-flex u-col-top"><div class="fontNormal">a、</div><view>如果委托人未接电话，请先发个短信给委托人，避免委托人把您电话误认为骚扰电话：</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>您好，我是法力app的XXX律师。刚刚是我来电，方便的时候请回个电话给我，跟您了解下案情。如有资料需要上传，请打开法力app，在“办公”→“信息”→“委托人协作团队”群聊里，告诉我们。感谢您的信任与支持！<view style="color: #007aff;display: inline-block;" @click="copy('您好，我是法力app的XXX律师。刚刚是我来电，方便的时候请回个电话给我，跟您了解下案情。如有资料需要上传，请打开法力app，在“办公”→“信息”→“委托人协作团队”群聊里，告诉我们。感谢您的信任与支持！')">复制</view></view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">b、</div><view>如果委托人接了电话，请说：</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>“您好，我是法力app的XXX律师，请问怎么称呼您？”</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>“x先生/女士，您好！现在方便占用您几分钟时间，跟您了解下案情吗？”</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>“您有任何补充的，可以打开法力app，在“办公”页面的群聊里，告诉我们，我们会一并研究，谢谢”。</view></view>
      <view class="title titles underline"> <div class="leftpoint">·</div> 接单后，请先联系委托人提供其主体资料或身份资料，以便您与律师事务所办理收案登记，以及后续催收欠缴的律师费。</view>
      <view class="title titles underline"> <div class="leftpoint">·</div> 您和委托人签署的委托代理合同里，请务必约定以下内容，以便委托人不付款时，法力平台为您免费安排律师催收：</view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">a、</div><view>逾期未支付任一律师费用的，需另行支付逾期付款滞纳金直至付清款项为止。同时，还应承担追索律师费用时所支出的一切成本费用，包括但不限于律师费、保全费、保全担保费、公证费、调查费、交通差旅费等。</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>滞纳金计算公式为：逾期未付金额×万分之五×逾期天数。</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">b、</div><view>如有争议的，双方同意交由XXX律师事务所所在地的人民法院管辖。</view></view>

      <view class="title titles underline"> <div class="leftpoint">·</div> 需要委托人签署的任何文件，比如起诉文书、答辩文书等：</view>
      <view class="title">  <div class="fontNormal marginLeft5"></div>请您打印出来；</view>
      <view class="title">  <div class="fontNormal marginLeft5"></div>在需要签名或盖章的地方，用铅笔画圈；</view>
      <view class="title">  <div class="fontNormal marginLeft5"></div>然后快递给委托人签署。</view>
      <view class="title">  <div class="leftpoint">·</div> 委托人咨询您的问题，如果您不知道如何回答的，请先按如下话术跟委托人交代下，然后再去研究答案：</view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft5"></div><view>X总，我先查下法律规定和司法判例有无新的变化，下午/明天上午答复您，谢谢。</view></view>

      <view class="title titles underline"> <div class="leftpoint">·</div> 跟客户汇报工作，请严格按照如下要求办理，减少客户对您工作的误解：</view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">a、</div><view>工作不论大小，每一步都要立即汇报给客户，就算是打法官电话没打通，也要立即汇报。</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">b、</div><view>每次汇报，前3句话内一定要告诉客户：</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>你这次汇报是关于什么的事情，或者你要客户帮你做什么事情，再具体解释情况。</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">c、</div><view>解释情况的内容分为两部分：</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>当前进展情况+下一步你在什么时间内会完成什么事项/请示客户就哪方面作出决策。</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">d、</div><view>解释当前情况时：</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>按1、2、3……分段汇报；</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>每段只讲一个点，把这个点说清楚。不要把多个点放在一段里讲，一是会说不清楚，二是客户也无法快速看明白，给您答案，因为客户不专业，而且也没时间细看，都是一扫而过。这样交流效率就极低，会导致客户认为您不专业。</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">e、</div><view>解释下一步工作安排时，必须明确4要素：</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>具体时间点/时限</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>地点</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>对接人物</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal marginLeft15"></div><view>要做啥/实现什么结果</view></view>
      <view class="title u-flex u-col-top">  <div class="fontNormal">f、</div><view>如果是自己责任造成的，先跟团队想好解决方案，再把（问题和解决方案）一起汇报给客户。不要隐瞒问题，更不要光说问题，不说解决方案。</view></view>

      <view class="title"> <div class="leftpoint">·</div> 订单里，点击“服务完成”前，请您务必在本平台“办公”→“信息”→相应订单“委托人协作团队”群聊里，与委托人确认好服务已经完成，以免产生纠纷影响平台划转服务费用给您。</view>
      <view class="title"> <div class="leftpoint">·</div> 您收到服务费用后，请依法及时申请律师事务所开具票给委托人。</view>
      <view class="title"> <div class="leftpoint">·</div> 请遵守职业道德与职业操守，不泄露委托人的隐私。</view>
      <view class="title">  <div class="leftpoint">·</div> 服务过程中发生争议的，请与委托人友好协商，协商不成的，您及律师事务所、委托人以及本平台均同意提交广州仲裁委员会裁决。</view>
    </view>

    <view class="item-title" :class="isBold ? 'bold' : 'weight'">各产品服务保障说明</view>
    <view class="item-intro intro_txt" :class="isDown ? 'heightMy' : ''">
      <!--      <image v-if="title == '产品说明'" :src="img_src" style="width: 100%" mode="widthFix"></image>-->
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(1,'15分钟无理由更换律师')"><view>15分钟无理由更换律师</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(2,'边用边付')"><view>边用边付</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(3,'先用后付')"><view>先用后付</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(4,'平台托管费用')"><view>平台托管费用</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(5,'换个律师')"><view>换个律师</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
   </view>

    <view class="item-title" :class="isBold ? 'bold' : 'weight'">各产品服务说明</view>
    <view class="item-intro intro_txt" :class="isDown ? 'heightMy' : ''">
      <!--      <image v-if="title == '产品说明'" :src="img_src" style="width: 100%" mode="widthFix"></image>-->
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(6,'问一下')"><view>问一下</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(9,'陪同办')"><view>陪同办</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(7,'写合同')"><view>写合同</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(10,'打官司')"><view>打官司</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
      <view class="title u-flex u-row-between u-col-center u-m-t-5" @click="toXiangqing(8,'刑事会见')"><view>刑事会见</view><image style="width: 16rpx;height: 26rpx;" src="@/static/img/gray-right-arrow.png"></image></view>
    </view>
    <!-- <view class="item-down" v-if="showDown" @click="down">
      <text class="down-txt" v-if="isDown">展开</text>
      <text class="down-txt" v-if="!isDown">收起</text>
    </view> -->
  </view>
</template>

<script>
export default {
  props: {
    title: '',
    content: '',
    isBold: false,
    img_src:''
  },
  data() {
    return {
      isDown: false,
      showDown: true,
      isCollect: false
    };
  },
  methods: {
    down() {
      this.isDown = !this.isDown;
    },
    collect() {
      this.isCollect = !this.isCollect;
    },
    toXiangqing(type,title){
      console.log("========type",type,title)
      this.jump(`/pages/client/index/lawyer-jiedan/chanpin`,{type,title})
    },
    copy(node) {
      if (!node) {
        return;
      }
      var result;
      // 将复制内容添加到临时textarea元素中
      var tempTextarea = document.createElement('textarea');
      document.body.appendChild(tempTextarea);
      if (typeof(node) == 'object') {
        // 复制节点中内容
        // 是否表单
        if (node.value) {
          tempTextarea.value = node.value;
        } else {
          tempTextarea.value = node.innerHTML;
        }
      } else {
        // 直接复制文本
        tempTextarea.value = node;
      }
      // 判断设备
      var u = navigator.userAgent;
      console.log(u.match(/(iPhone|iPod|iPad);?/i))
      if (u.match(/(iPhone|iPod|iPad);?/i)) {
        // iOS
        // 移除已选择的元素
        window.getSelection().removeAllRanges();
        // 创建一个Range对象
        var range = document.createRange();
        // 选中
        range.selectNode(tempTextarea);
        tempTextarea.select();
        // 执行选中元素
        window.getSelection().addRange(range);
        // 复制
        result = document.execCommand('copy');
        // 移除选中元素
        window.getSelection().removeAllRanges();

      } else {
        // 选中
        tempTextarea.select();
        // 复制
        result = document.execCommand('Copy');
      }
      // 移除临时文本域
      document.body.removeChild(tempTextarea);
      if (result) {
        uni.showToast({
          duration:1000,
          icon:'none',
          title:"复制成功"
        })
      } else {
        uni.showToast({
          duration:1000,
          icon:'none',
          title:"复制失败"
        })
      }

      return result;
    }
  }
};
</script>

<style lang="scss">
.heightMy {
  height: 210rpx;
  overflow: hidden;
}
.bold {
  font-weight: bold;
  color: #000 !important;
}
.weight{
  color: #000 !important;
  font-weight: 700;
}
.detail-item {
  background-color: #ffffff;
  margin-bottom: 20rpx;
  padding: 30rpx;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  .item-title {
    width: 100%;
    color: #aaa;
    margin-bottom: 20rpx;
    text-align: center;
    margin-top: 20rpx;
  }
  .item-intro {
    width: 100%;
    line-height: 50rpx;

    .title{
      div{
        display: inline-block;
      }
      text-align: justify;
      padding-left: 8px;
      position: relative;
      .leftpoint{
        position:absolute;
        left:-1px;
        font-weight: normal;
        color:#303133;
      }
      .fontNormal{
        font-weight: normal;
      }
      .marginLeft5{
        display: inline-block;
        margin-right:8px;
      }
      .marginLeft15{
        margin-right:34rpx;
      }
    }
    .titles{
      font-weight: 550;
    }
    .underline{
      text-decoration:underline!important;
    }
  }
  .item-down {
    width: 100%;
    text-align: right;
    .down-txt {
      color: #06b4fd;
      text-align: right;
    }
  }
}
</style>
